<template>
  <div class="addpatient">
    <navtab :title="title" />
    <div class="info">
      <div class="name item"><span>姓名</span><input
          type="text"
          v-model="name"
        /></div>
      <div class="relations item">
        <span>就诊人关系</span>
        <van-radio-group
          v-model="relation"
          direction="horizontal"
        >
          <van-radio
            name="本人"
            icon-size="15px"
          >本人</van-radio>
          <van-radio
            name="配偶"
            icon-size="15px"
          >配偶</van-radio>
          <van-radio
            name="父母"
            icon-size="15px"
          >父母</van-radio>
          <van-radio
            name="子女"
            icon-size="15px"
          >子女</van-radio>
        </van-radio-group>
      </div>
      <div class="name item"><span>身份证号</span><input
          type="text"
          v-model="shennumber"
        /></div>
      <div class="sex item">
        <span>性别</span>
        <van-radio-group
          v-model="sex"
          direction="horizontal"
        >
          <van-radio
            name="男"
            icon-size="15px"
          >男</van-radio>
          <van-radio
            name="女"
            icon-size="15px"
          >女</van-radio>
        </van-radio-group>
      </div>
      <div class="birthday item"><span>出生年月</span></div>
      <div class="linaxi item"><span>联系电话</span><input
          type="text"
          v-model="phone"
        /></div>
      <div class="btn">
        <van-button type="primary">保存</van-button>
      </div>
    </div>
  </div>
</template>
<script>
import Navtab from '../../../components/Navtab'
export default {
  components: {
    Navtab
  },
  data: () => ({
    title: '',
    relation: '本人',
    sex: '男',
    shennumber: '',
    phone: '',
    name: ''
  })
}
</script>
<style lang="scss" scoped>
.addpatient {
  .info {
    margin-top: 5px;
    padding-left: 5px;
    .item {
      height: 20px;
      font-size: 7px;
      line-height: 20px;
      border-bottom: 1px solid #eee;
      display: flex;
      span {
        display: block;
        width: 50px;
        // background: #000;
      }
      input {
        border: none;
      }
    }
    .relations {
      justify-content: flex-start;
      .van-radio__label {
        font-size: 8px;
      }
    }
    .btn {
      margin-top: 10px;
      display: flex;
      justify-content: center;
      button {
        width: 100px;
      }
    }
  }
}
</style>
